<script src="../js/orientdb-graph.js" language="javascript" type="text/javascript"></script>
<script src="js/jit/jit-yc.js" language="javascript" type="text/javascript"></script>
<table style="width: 100%;" cellpadding="0" cellspacing="2">
	<tr>
		<td valign="top">
			<table style="width: 100%;" cellpadding="2" cellspacing="0">
				<tr>
					<td valign="top">
						<div id="center-container">
							<div id="graphPanel"></div>
						</div></td>
					<td valign="top">
						<table>
							<tr>
								<td valign="top" align="center">Lazy load depth <input id="graph-load-depth" type="text" value="2" width="1" />
								</td>
							</tr>
							<tr>
								<td>
									<div id="graph-inner-details"></div></td>
							</tr>
							<tr>
								<td>
									<button id="editGraph" class="ui-button-text-icon" style="width: 90px; text-align: center">
										Edit <img border="0" alt="Edit record" src="images/set.png" align="top" />
									</button></td>
							</tr>
						</table></td>
				</tr>
				<tr>
			</table></td>
	</tr>
</table>

<script language="javascript">
	graphEditor = new OGraph(null, 'graphPanel', 'graph-inner-details',
			'graph-load-depth');

	function loadDocument(rid, level) {
		if (rid == null)
			return null;

		// LAZY LOAD IT
		var node = orientServer.load(rid, "*:" + level);
		if (node == null)
			return null;

		return graphEditor.document2node(node);
	}

	$("#editGraph").click(function() {
		if (selectedObject != null)
			displayDocument(selectedObject, orientServer);
	});
</script>